<template lang="html">
  <div class="">
    <vue-preview class="previewImg" :slides="slide1" @close="handleClose"></vue-preview>
  </div>
</template>

<script>
export default {
  data(){
      return{
        paramPic: this.$route.params.picList,
        slide1: [
          {
            src: 'https://farm6.staticflickr.com/5591/15008867125_68a8ed88cc_b.jpg',
            msrc: 'https://farm6.staticflickr.com/5591/15008867125_68a8ed88cc_m.jpg',
            alt: 'picture1',
            title: 'Image Caption 1',
            w: 600,
            h: 400
          },
          {
            src: 'https://farm4.staticflickr.com/3902/14985871946_86abb8c56f_b.jpg',
            msrc: 'https://farm4.staticflickr.com/3902/14985871946_86abb8c56f_m.jpg',
            alt: 'picture2',
            title: 'Image Caption 2',
            w: 1200,
            h: 900
          },{
          src: 'http://ww1.sinaimg.cn/large/7a8aed7bgw1evmsyc7thzj20hs0qon0n.jpg',
          msrc: 'http://ww1.sinaimg.cn/large/7a8aed7bgw1evmsyc7thzj20hs0qon0n.jpg',
          w: 1200,
          h: 900
          }
        ]

      }
  },
  created(){
  },
  methods:{
    handleClose () {
        console.log('close event')
      }
  }

}
</script>

<style lang="scss">
  .previewImg{
    width: 200px;
    height: 150px;
  }
</style>
